<!-- 
 * 新增需求
 * @author: 冯宇
 * @since: 2022-05-16
 * index.vue
-->
<template>
    <div class="detail-patent-container detailsPageBox">
        <div class="detailsMain">
            <div class="main-title">{{  data.form.ttl  }}</div>
            <div class="patent-content">
                <div class="c-left">
                    <div class="c-head">著作项</div>
                    <el-form :model="data.form" label-position="right" label-width="86px">
                        <el-form-item label="申请号:">
                            <div>{{ data.form.apn }}</div>
                        </el-form-item>
                        <el-form-item label="申请日期:">
                            <div>{{ data.form.apd }}</div>
                        </el-form-item>
                        <el-form-item label="公开(公告)号:">
                            <div>{{ data.form.pn }}</div>
                        </el-form-item>
                        <el-form-item label="公开(公告)日:">
                            <div>{{ data.form.isd }}</div>
                        </el-form-item>
                        <el-form-item label="发明人:">
                            <div>{{ data.form.in.join('，') }}</div>
                        </el-form-item>
                        <el-form-item label="申请人:">
                            <div>{{  data.form.an.join('，')  }}</div>
                        </el-form-item>
                        <el-form-item label="IPC:">
                            <div>{{ data.form.ipc.join('，') }}</div>
                        </el-form-item>
                        <el-form-item label="地址:">
                            <div>{{ data.form.ns.join('') }}</div>
                        </el-form-item>
                    </el-form>
                </div>
                <div class="c-right">
                    <div class="c-head">摘要</div>
                    <div class="text">{{  data.form.abst  }}</div>
                </div>
            </div>
        </div>

        <!-- <div class="send-btn detailsHandBtn">
        <el-button style="width: 100px;height:36px" @click="backRoute('patent')">返回</el-button>
      </div> -->
    </div>
</template>
  
  
<script setup>
import { onMounted, reactive, onUnmounted} from 'vue'
import { allPatentDetailApi } from '@/api/interface/patent.js'

import { useStore } from 'vuex'
import { useRouter, useRoute } from 'vue-router'
const store = useStore()
const router = useRouter()
const route = useRoute()

const props = defineProps({
    id: {
        type: String,
    },
})

const data = reactive({
    form: {
        apn: '',
        apd: '',
        pn: '',
        isd: '',
        in: [],
        an: [],
        ipc: [],
        ns: [],
        abst:''
    },
})



onMounted(() => {
    const level = router.currentRoute.value.meta.level
    store.dispatch('setting/setRouterCut', level)
})
onUnmounted(() => {
    store.dispatch('setting/setRouterCut', 2)
})


//获取专利详情
const getPatentDetail = () => {
    allPatentDetailApi({ pn: props.id ? props.id : sessionStorage.patentId }).then(res => {
        if (res.status === 200) {
            data.form = res.data
        }
    })
}
 getPatentDetail()


</script>
  
<style lang="scss" scoped>
.detailsMain {
    padding: 20px;
    color: #333;
    .main-title{
        padding: 20px;
        font-weight: 700;
        background: #F5F7FD;
        border-radius: 4px;
    }
    .patent-content {
        display: flex;
        .c-head{
            margin: 20px 0;
            font-weight: 700;
        }
        .c-left,
        .c-right {
            flex: 1;

            .text {
                font-size: 12px;
            }
        }
        :deep(.el-form-item__label){
            font-weight: 700;
        }
        :deep(.el-form-item__content){
            font-size: 12px;
        }
    }
}
</style>